<template>
    <div class="UserAgreement-main">
        <van-nav-bar left-arrow @click-left="onClickLeft">
            <template #left>
                <van-icon :name="backicon" size="20"/>
            </template>
            <template #title>
                <span class="hometitle">{{context.title}}</span>
            </template>
        </van-nav-bar>
        <div class="Agreement-detail" >
            <!-- <img v-if="context.thumb!=''" :src="`http://www.starrymedia.vip${context.thumb}`" alt=""> -->
            <div class="Agreement-detail-part" id="DbContext" v-html="context.context">
            </div>
        </div>
    </div>
</template>
<script>
import {_getDocument} from '../../service/main'
export default {
    data(){
        return{
            context:{},
            backicon:require('../../assets/img/backicon.png'),
        }
    },
    mounted(){
        this.getrule()
    },
    methods:{
        onClickLeft(){
            this.$router.go(-1)
        },
        html_decode(str) 
        {   
            var s = ""; 
            if (str.length == 0) return ""; 
            s = str.replace(/&amp;/g, "&"); 
            s = s.replace(/&lt;/g, "<"); 
            s = s.replace(/&gt;/g, ">"); 
            s = s.replace(/&nbsp;/g, " ");
            s = s.replace(/&#39;/g, "\'"); 
            s = s.replace(/&quot;/g, "\""); 
            s = s.replace(/<br\/>/g, "\n");

            s=s.replace(/\/public/g,"http://www.starrymedia.vip/public")
            return s; 
        },
        getrule(){
            let _this=this
            let id = this.$route.query.id
            _getDocument({id:id}).then(res=>{
                if(res.errcode==1){
                    res.data.context=this.html_decode(res.data.content)
                    _this.context=res.data
                    console.log(_this.context)
                }
            })
        },
    }
}
</script>
<style lang="less" scoped>
.UserAgreement-main{
    width: 100%;
    height: 100vh;
    overflow-y: auto;
    .hometitle{
        font-size: 18px;
        font-family: "PingFang SC","Microsoft YaHei";
        font-weight: bold;
        color: #000;
        line-height: 46px;
    }
    .Agreement-detail{
        width: 100%;
        font-family: "PingFang SC","Microsoft YaHei";
        font-size: 10px;
        color: #666;
        img{
            width: 100%;

        }
        .Agreement-detail-part{
            width: 100%;
            p{
                img{
                    width: 100%;
                    max-width: 100%;
                }
            }
        }
        #DbContext{
            /deep/ img{
                width: 100%;
                max-width: 100% ;
            }
        }
    }
    .conifirm{
        width: 254px;
        position: absolute;
        bottom: 43px;
        left: 67px;
        right: 67px;
    }
}

#DbContext img{
    width: 100%;
    max-width: 100% !important;
}
</style>